function bindElements(){

	//bind submit button
    $("#Submit").bind('click', function(){
        if(validateElements()){
            Badges = $('input[id="BadgeID"]');            
            $.each(Badges,function(i, badge){
                if( $(badge).val() != "" || isNaN($(badge).val()) ){
                    var ParentID = $(badge).parent().parent().parent().attr('id');
                    var BadgeObj = {StepID: ParentID, BadgeID: badge.value};                    
                    $.ajax({
                        type:'POST', url:$("#FormAction").val(), 
                        dataType: 'json', async: false, data: BadgeObj,
                        success: function(json) { jsonData = json },
                        complete: function(){ return false; },
                        error: function(){ return false; }
                    });                  
                }
            });
            location.href = '../status.cfm';            
        }
    });

}

var validateElements = function(){
    //sets error count to zero, if greater then zero, some data is not valid
    var error_count = 0;

    //var for required element error message.  A custom message can 
    //be set on the input element called error_message
    var require_message = function(id){     
        return $("#" + id).attr('error_message');   
    }

    //these fields are require on form.
    //var required_fields = ['BadgeID'];
    
    //these fields are integer fields
    var integer_fields = $('input[id="BadgeID"]');
    
    //removes error messages from previous validation.
    $(".ui-state-error").removeClass();
    
    //creates html of errors
    var html_errors = function(){
        var error_link = "";        
        //if fields in the required_fields variable are empty this error is triggered.
        
        //if ext field is entererd and malformed, error is triggered
        $.map(integer_fields,function(field){
            var message = function(id){     
                return $(id).attr('error_message');   
            }
            if( $(field).val() && isNaN( $(field).val() ) ){
                error_count++;
                $(field).addClass('ui-state-error');
                var ParentID = $(field).parent().parent().parent().attr('id');
                error_link = error_link + "<span class='link_error'" + "id='error_link_" + ParentID + "'>" + 
                $(field).attr('id') + ":</span> " + message($(field)) + "<br />";
            }
        });

        return error_link;
    };
    
    //creates jquery ui dialog box html
    $("div.entry").append('<div id="error_dialog" style="width: auto;"><p>' + html_errors() + '</p></div>');
    
    //creates jquery ui dialog box object
    var $error_dialog = $('#error_dialog').dialog({
        autoOpen: false, width: 'auto', modal: true, title: 'The following fields have errors', resizable: false,
        open: function(event, ui) { $("div.ui-dialog-titlebar").width( $(".ui-dialog").width() ); },
        close: function(event, ui) {$(this).dialog( "destroy" ) }
    });

    //if no errors in validation, well... the data is valid!
    if(error_count){
        $error_dialog.dialog('open');
        $("span[id^='error_link_']").click(function(){
            var element_id = "#" + this.id.split("_")[2];            
            element_id = $(element_id + " tr td:eq(3) input[id='BadgeID']");
            $.scrollTo(element_id);//jquery pluging ScrollTo
            $error_dialog.dialog('close');
            $(element_id).focus();
        });
        return false;
    }else{return true;}
};



$(function(){
	bindElements();
});